<template>
  <div class="foot">
    <div class="con">
      <div>
        <div class="tit">關於我們</div>
        <div class="nav" @click="gotodetail(1)">品牌故事</div>
        <div class="nav" @click="gotodetail(2)">使用條款</div>
        <div class="nav" @click="gotodetail(3)">隱私政策</div>
      </div>
      <div>
        <div class="tit">產品系列</div>
        <div class="nav" @click="gotodetail(4)">最新推廣</div>
        <div class="nav" @click="gotoOther(index,item)" v-for="(item,index) in arr" :key='index'>{{item.name}}</div>
        <!-- <div class="nav" @click="gotodetail(5)">幸福飲食</div>
        <div class="nav" @click="gotodetail(6)">禮品專區</div>
        <div class="nav" @click="gotodetail(7)">家居生活</div> -->
      </div>
      <div>
        <div class="tit">購買指南</div>
        <div class="nav" @click="gotodetail(8)">付款方式</div>
        <div class="nav" @click="gotodetail(9)">送貨安排</div>
        <div class="nav" @click="gotodetail(10)">換貨及退貨</div>
        <!-- <div class="nav" @click="gotodetail(11)">常見問題</div> -->
      </div>
      <div>
        <div class="tit">幸福會員</div>
        <div class="nav" @click="gotodetail(12)">如何申請</div>
        <div class="nav" @click="gotodetail(13)">申請須知</div>
        <div class="nav" @click="gotodetail(14)">獨家優惠</div>
        <div class="nav" @click="gotodetail(11)">常見問題</div>
      </div>
      <div>
        <div class="tit">幸福滋味中心</div>
        <div class="nav2">九龍荔枝角道838號勵豐中心7樓705-706室</div>
        <div class="nav2">營業時間:</div>
        <div class="nav2">週—至五：10:00-21:00 週六：12:00-19:00 週日及公眾假期休息</div>
        <div class="nav2">電話查詢：2327 1777 / Whatsapp: 5540 4238 (只接受信息）</div>
        <div class="nav2">電郵：info@hometasty.hk</div>
        
      </div>
      <div class="careUs">
        <div class="tit"><img src="https://hometasty.hk/demo/guanzhuwom.png"/></div>
        <div class="nav">
           <img src="./../assets/foot2.png" alt="" @click="footo"> <img src="./../assets/foot1.png" alt="" @click="footp">
        </div>
      </div>
    </div>
    <div class="foot_text">Copyright 2020 Hometasty Co., Ltd. All rights reserved.</div>
    

     <div class="fb-customerchat" attribution=setup_tool page_id="109261104114015" theme_color="#cf814f"
  logged_in_greeting="歡迎光臨 幸福滋味" logged_out_greeting="歡迎光臨 幸福滋味"></div>
  </div>
</template>

<script>
  // window.onload =  function () {
    // setTimeout(function () {
      window.fbAsyncInit = function () {
        FB.init({
          xfbml: true,
          version: 'v7.0'
        });
      };
      (function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = 'https://connect.facebook.net/zh_HK/sdk/xfbml.customerchat.js';
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    // },20)
  // }
import {getcarousel} from '@/api/index'
export default {
  name: 'Footer',
  data () {
    return {
      arr:[]
    }
  },
  mounted(){
    this.getMenu()
  },
  methods:{
    getMenu(){
      getcarousel().then(response => {
        if(response.errno == 0){
          this.arr = response.data
          console.log(this.arr)
        }
      })
    },
    gotoOther(e,item){
      e = e+2
      sessionStorage.setItem('menu',e)
      this.isActive = e
      this.$router.push({path:'/home',query:{classifyid:e,checkid:item.id,sta:1}})
      window.location.reload()
    },
    gotodetail(e){
      if(e == 4){
        this.$router.push({
         path:'/home',
         query:{
           classifyid:1,
           sta:1
         }
       })
       window.location.reload()
      }else{
        this.$router.push({
          path:'/footdetail',
          query:{
            id:e,
            t: Date.now()
          }
        })
      }
    },
    footp(){
      window.open("https://instagram.com/hometasty.hk?igshid=16knqi6rrv1zx","_blank");   
    },
    footo(){
      window.open("https://www.facebook.com/hometasty.hk/","_blank");
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.foot{
  width: 100%;

  /* height: 240px; */
  background: #BE795A;
  color: white;
  margin-right: 60px;
}
.careUs{margin-left: 150px;}
.con{
  width: 90%;
  /* margin-left: 20%; */
  display: flex;
  margin-left: 60px;
  justify-content: space-between;
}
.foot_text{
  text-align: right;
  padding-right:15px;
  line-height: 30px;
  box-sizing: border-box;
  padding-bottom: 10px;
}
.tit{
  font-size: 20px;
  font-weight: bold;
  margin-top: 50px;
  /* margin-left: 60px; */
}
.nav{
  /* margin-left: 60px; */
  font-size: 16px;
  margin-top: 15px;
  max-width: 510px;
  text-align: center;
}
.nav2{
  /* margin-left: 60px; */
 font-size: 16px;
  margin-top: 15px;
 width: 610px;
}
.nav img{
  width: 30px;
  
}
.nav img:nth-child(1){
  margin-right: 30px;
}
</style>
